<template>
  <div class='grid-test work-desk'>
    <div style="padding: 8px 4px 4px 8px;">
      <FundsoutlayCharts router-name="countylevelFunding-statistics"/>
    </div>
    <div style="padding: 8px 4px 4px 4px;">
      <PieCharts index="2" title="三调实施方案备案" url="survey/report/statisticsSurveyProgress" 
        data-key="sbba" router-name="implementation-statistics"
        nameFinish="已备案区县" nameUnfinish="未备案区县"/>
    </div>
    <div style="padding: 8px 4px 4px 4px;">
      <PieCharts index="3" title="县级内业处理" url="survey/report/statisticsSurveyProgress" 
        data-key="xjny" router-name="countylevel-processing"/>
    </div>
    <div style="padding: 8px 8px 4px 4px;">
      <PieCharts index="4" title="县级外业调查" url="survey/report/statisticsSurveyProgress" 
      data-key="xjwy" router-name="foreigntrade-county"/>
    </div>
    <div style="padding: 4px 4px 4px 8px;">
      <PieCharts index="5" title="地类样本举证" url="analysis/spot/surveyProgressStatistic" 
      data-key="slCount" router-name="countylevelLandType-statistics"/>
    </div>
    <div style="padding: 4px 4px 4px 4px;">
      <PieCharts index="6" title="初次举证" url="analysis/spot/surveyProgressStatistic" 
      data-key="isCount" router-name="countylevelFirstProof-statistics"/>
    </div>
    <div style="padding: 4px 4px 4px 4px;">
      <PieCharts index="7" title="县级建库" url="survey/report/statisticsSurveyProgress" 
        data-key="xjjk" router-name="countylevel-construction"/>
    </div>
    <div style="padding: 4px 8px 4px 4px;">
      <IntranetHc router-name="provincelevelInner-statistics"/>
    </div>
    <div style="padding: 4px 4px 8px 8px;">
      <PieCharts index="9" title="省级外业核查" url="analysis/spot/surveyProgressStatistic" 
        data-key="hcCount" router-name="provincelevelOuter-statistics"/>
    </div>
    <div style="padding: 4px 4px 8px 4px;">
      <PieCharts index="10" title="县级成果上报国家" url="survey/report/statisticsSurveyProgress" 
        data-key="xjsb" router-name="countylevel-achievements"
        nameFinish="已上报区县" nameUnfinish="未上报区县"/>
    </div>
    <div style="padding: 4px 4px 8px 4px;">
      <PieCharts index="11" title="县级成果国家核查" url="survey/report/statisticsSurveyProgress" 
        data-key="gjhc" router-name="countylevelChcked-statistics"
        nameFinish="已通过区县" nameUnfinish="未通过区县"/>
    </div>
    <div style="padding: 4px 8px 8px 4px;">
      <!-- <PieCharts index="12" title="省级建库" url="survey/report/statisticsSurveyProgress" 
        data-key="sjjk" router-name="provincelevelCreate-statistics"/> -->
    </div>
  </div>
  <!-- <el-container class="h-100 work-desk">
    <el-main>
      <el-row :gutter="20" style="height: 50%;">
        <el-col :span="8" >
          <PolicyLaws />
        </el-col>
        <el-col :span="8">
          <TotalCharts />
        </el-col>
        <el-col :span="8">
          <FundsoutlayCharts />
        </el-col>
      </el-row>
       <el-row :gutter="20" style="height: 50%;">
        <el-col :span="8" class="mt-3">
          <ProvinceChart />
        </el-col>
        <el-col :span="8" class="mt-3">
          <CountyChart />
        </el-col>
        <el-col :span="8" class="mt-3">
          <NoticeRecord />
        </el-col>
      </el-row>
    </el-main>
  </el-container> -->
</template>
<script>
import FundsoutlayCharts from './home/FundsoutlayCharts' // 经费
import PieCharts from './home/PieCharts'
import IntranetHc from './home/IntranetHc'

import PolicyLaws from './home/PolicyLaws'
import CountyChart from './home/CountyChart'

import NoticeRecord from './home/NoticeRecord'
import ProvinceChart from './home/ProvinceChart'
import TotalCharts from './home/TotalCharts'

export default {
  name: 'workdesk',
  title: '工作台',
  components: {
    FundsoutlayCharts,
    PieCharts,
    IntranetHc,

    PolicyLaws,
    CountyChart,
    ProvinceChart,
    NoticeRecord,
    TotalCharts
  },
  data() {
    return {}
  }
}
</script>
<style lang='scss'>
 .wd-card-body {
    // height: 250px;
    height: 100%;
    // padding: 20px;
    overflow: auto;
    li {
      &:hover {
        background: #E6F7FF;
        color: #1976D2;
      }
    }
  }
 .work-desk {
  .el-card__header {
    padding: 0;
    .header-index {
      padding: 8px;
      font-size: 20px;
      width: 45px;
      font-weight: bold;
      text-align: center;
      background: #D0D3D6;
    }
    .header-title {
      line-height: 45px;
    }
  }
  .el-card__body {
    padding: 0;
  }
  .text {
    font-size: 14px;
  }
  .item {
    margin-bottom: 18px;
  }
  .clearfix {
    font-size: 18px;
  }
  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both;
  }
 }
  
</style>

<style lang='scss' scoped>
  .grid-test {
    height: calc(100vh - 60px);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    // grid-gap: 0.5rem 0.5rem;
    .item {
      height: 100%;
      overflow: auto;
    }
  }
</style>